import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import 'amfe-flexible'
import {
  Divider, NavBar, Form, Field, Button, Icon, Tab, Tabs, Tabbar,
  TabbarItem, Cell, List, PullRefresh, ActionSheet, Popup, Row,
  Col, Badge, Search, Image, Tag, CellGroup, Dialog, Notify
  , DatetimePicker
} from 'vant'

Vue.use(DatetimePicker)
Vue.use(Notify)
Vue.use(Dialog)
Vue.use(CellGroup)
Vue.use(Tag)
Vue.use(Divider)
Vue.use(Image)
Vue.use(Search)
Vue.use(Row)
Vue.use(Col)
Vue.use(Badge)
Vue.use(Popup)
Vue.use(ActionSheet)
Vue.use(PullRefresh)
Vue.use(List)
Vue.use(Cell)
Vue.use(Tab)
Vue.use(Tabs)

Vue.use(Tabbar)
Vue.use(TabbarItem)
Vue.use(Icon)

// 引入单个组件样式

Vue.use(Button)

Vue.use(Form)
Vue.use(Field)

Vue.use(NavBar)
const directiveObj = {
  install (Vue) {
    Vue.directive('fofo', {
      inserted (el) {
        if (el.nodeName === 'INPUT' || el.nodeName === 'TEXTAREA') {
          el.focus()
        } else {
          const theText = el.querySelector('input') || el.querySelector('textarea')
          if (theText) theText.focus()
        }
      },
      updated (el) {
        if (el.nodeName === 'INPUT' || el.nodeName === 'TEXTAREA') {
          el.focus()
        } else {
          const theText = el.querySelector('input') || el.querySelector('textarea')
          if (theText) theText.focus()
        }
      }
    })
  }
}
Vue.use(directiveObj)
Vue.config.productionTip = false

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')
